<script>
import memoryUtils from "@/utils/memoryUtils";
import NavLists from "@/utils/NavigationLists";
export default {
  data() {
    return {
      navNodes: "",
    };
  },
  mounted() {
    this.navNodes = this.getNavNodes(NavLists);

    //  this.get()
  },
  // jsx调用函数
  render() {
    //  console.log(this.$router);
    return (
      <div>
        <el-menu
          router={true}
          default-active={this.$router.path}
          class="el-menu-vertical-demo"
          background-color="#545c64"
          text-color="#fff"
          active-text-color="#ffd04b"
        >
          {this.navNodes}
        </el-menu>
      </div>
    );
  },
  components: {},
  methods: {
    //  get(){
    //     setInterval(() => {
    //  }, 5000)
    //  },
    getNavNodes(NavLists) {
      return NavLists.map((item) => {
        if (this.hasAuth(item)) {
          if (!item.children) {
            return (
              <el-menu-item index={item.index}>
                <i class={item.icon}></i>
                <span slot="title">{item.title}</span>
              </el-menu-item>
            );
          } else {
            return (
              <el-submenu index={item.index}>
                <template slot="title">
                  <i class={item.icon}></i>
                  <span>{item.title}</span>
                </template>
                {this.getNavNodes(item.children)}
              </el-submenu>
            );
          }
        }
      });
    },
    // 判断当前登录用户状态
    hasAuth(item) {
      const user = memoryUtils.user;
      // console.log(memoryUtils.user);
      if (user == null) {
        user = this.$store.state.user;
      }
      // console.log("user", user);
      const { index, isPublic } = item;
      const menus = user.menus;
      const username = user.username;
      // console.log(menus, username);
      if (username == "admin" || isPublic || menus.indexOf(index) != -1) {
        return true;
      } else if (item.children) {
        return !!item.children.find(
          (child) => menus.indexOf(child.index) != -1
        );
      }
      return false;
    },
  },
};
</script>

<style scoped>
.el-menu-item {
  margin: 15px 0;
}
</style>